<template>
	<page>
		<view class='top-container'>
			<view class='top-item'>省</view>
			<view class='top-item'>市</view>
			<view class='top-item'>区</view>
		</view>
		<view class='container' :style="'height:'+system_height">
			<scroll-view scroll-y='true' class='left'>
				<view class='item left-item' :class="provinceActive == index ? 'active':''" v-for="(item,index) in provinceData"
				 :id="index" :data-name="item" @tap='onProvince'>{{item}}</view>
			</scroll-view>
			<scroll-view scroll-y='true' class='mid'>
				<view class='item mid-item ' :class="cityActive == index ? 'active' : ''" v-for="(item,index) in cityData" :id="index"
				 :data-name="item" @tap='onCity'>{{item}}</view>
			</scroll-view>
			<scroll-view scroll-y='true' class='right'>
				<view class='item right-item ' :class="districtActive == index ? 'active' : ''" v-for="(item,index) in districtData"
				 :id="index" :data-name="item" @tap='onDistrict'>{{item}}</view>
			</scroll-view>
		</view>
	</page>
</template>

<script>
	import app from '@/App.vue';
	import {
		GYZJMODEL as gyzjModel
	} from '@/utils/gyzjModel.js'
	export default {
		onLoad: function(options) {
			const pageType = options.pageType;
			this.pageType = pageType;
			this.getReginList(0, 1, '');
			/*进来获取设备宽高*/
			var that = this;
			uni.getSystemInfo({
				success: function(res) {
					
					// #ifdef MP-WEIXIN
					that.system_height = 2 * res.screenHeight + 'rpx';
					// #endif
					// #ifdef APP-PLUS
					that.system_height = 2 * res.screenHeight + 'upx';
					// #endif
			
				}
			})
		},
		methods: {
			//获取地区数据源 省
			getReginList: function(reginId, type, name) {
				var that = this;
				uni.showLoading({
					title: '数据加载中...',
				});
				gyzjModel.prototype.getReginList(reginId).then(data => {
					switch (data.code) {
						case 1:
							if (type == 1) {
								that.provinceData = data.data;
							} else if (type == 2) {
								this.cityData = data.data;
								this.districtData = [];
								this.provinceActive = reginId;
								this.provinceName = name;
							} else if (type == 3) {
								this.districtData = data.data;
								this.cityActive = reginId;
								this.cityName = name;
							}
							uni.hideLoading();
							break;
						default:
							uni.showToast({
								title: data.message,
								icon: 'none'
							});
							break;
					}
				})
			},

			/*城市的选择*/
			onProvince: function(e) {
				const id = e.currentTarget.id;
				const name = e.currentTarget.dataset.name;
				this.getReginList(id, 2, name);
			},
			/*区域的选择*/
			onCity: function(e) {
				const id = e.currentTarget.id;
				const name = e.currentTarget.dataset.name;
				this.getReginList(id, 3, name);
			},
			/*确认选择*/
			onDistrict: function(e) {
				const id = e.currentTarget.id;
				const name = e.currentTarget.dataset.name;
				var provinceActive=this.provinceActive;
				var provinceName=this.provinceName;
				var cityActive=this.cityActive;
				var cityName=this.cityName;
				var pageType=this.pageType;
				// const {provinceActive, provinceName, cityActive, cityName, pageType} =this.data;
				let pages = getCurrentPages(),
					currpage = pages[pages.length - 1],
					prevPage = pages[pages.length - 2];
				console.log('当前页是' + prevPage);
				console.log('当前pageType',pageType);

				if (pageType === 'release') {
					uni.showModal({
						title: '确认选择',
						content: `您当前选择的工程地点为${provinceName}${cityName}${name}，确认选择吗？`,
						confirmColor: '#f94c48',
						success: (res) => {
							if (res.confirm) {
								prevPage.setData({
									province_id: provinceActive,
									city_id: cityActive,
									district_id: id,
									consPlace: provinceName + cityName + name,
								});
								uni.navigateBack({});
							}
						}
					})
				} else if (pageType === 'indexBirth') {
					console.log('筛选籍贯进来');
					uni.showModal({
						title: '确认筛选',
						content: '您当前选择的工人籍贯为'+name+'，确认筛选吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							if (res.confirm) {
								prevPage.$vm.native_district_id= id;
								prevPage.$vm.birthPlaceName= name;
								prevPage.$vm.workerFilter();
								if (!uni.getStorageSync('index-city-filter')) {
									// event.emit('afterFilter');
									uni.setStorageSync('index-city-filter', true);
								}
								console.log('籍贯层数');
								uni.navigateBack();
							}
						}
					})
				} else if (pageType === 'JobListBirth') {
					console.log('筛选籍贯进来');
					uni.showModal({
						title: '确认筛选',
						content: '您当前选择的地区为'+name+'，确认筛选吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							console.log('prePage是多少');
							console.log(res.confirm);
							if (res.confirm) {
								prevPage.$vm.native_district_id= id;
								prevPage.$vm.birthPlaceName= name;
								uni.navigateBack();
								prevPage.$vm.JobDistrictFilter();
							}
						}
					})
				} else if (pageType === 'JobListBirthTwo') {
					console.log('筛选籍贯进来');
					uni.showModal({
						title: '确认筛选',
						content: '您当前选择的地区为'+name+'，确认筛选吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							console.log('prePage是多少');
							console.log(res.confirm);
							if (res.confirm) {
								prevPage.$vm.native_district_id= id;
								prevPage.$vm.birthPlaceName= name;
								uni.navigateBack();
								prevPage.$vm.JobDistrictFilter();
							}
						}
					})
					/*个人信息的pageType*/
				} else if (pageType === 'infoBirth') {
					uni.showModal({
						title: '确认选择',
						content: '您当前选择的籍贯为 '+name+' 确认选择吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							if (res.confirm) {
								let userInfo = prevPage.$vm.userInfo;
								console.log('userInfo的值',userInfo);
								userInfo.nativeProvince = {
									name: provinceName,
									id: provinceActive,
								};
								userInfo.nativeCity = {
									name: cityName,
									id: cityActive,
								};
								userInfo.nativeDistrict = {
									name,
									id,
								}
								prevPage.$vm.native_province_id=provinceActive;
								prevPage.$vm.native_city_id=cityActive;
								prevPage.$vm.native_district_id=id;
								prevPage.$vm.userInfo=userInfo;
								// prevPage.setData({
								// 	native_province_id: provinceActive,
								// 	native_city_id: cityActive,
								// 	native_district_id: id,
								// 	userInfo,
								// });
								uni.navigateBack({});
							}
						}
					})
				} else if (pageType === 'infoPlace' || pageType === 'vipPlace') {
					uni.showModal({
						title: '确认选择',
						content: '您当前选择地为'+name+'，确认选择吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							if (res.confirm) {
								let userInfo = prevPage.$vm.userInfo;
								userInfo.province = {
									name: provinceName,
									id: provinceActive,
								};
								userInfo.city = {
									name: cityName,
									id: cityActive,
								};
								userInfo.district = {
									name,
									id,
								}
								prevPage.$vm.province_id=provinceActive;
								prevPage.$vm.city_id=cityActive;
								prevPage.$vm.district_id=id;
								prevPage.$vm.userInfo=userInfo;
								uni.navigateBack({});
							}
						}
					})
				} else if (pageType === 'navbarRelease') {
					uni.showModal({
						title: '确认筛选',
						content: '您当前选择的工人老乡为'+name+'，确认筛选吗？',
						confirmColor: '#f94c48',
						success: (res) => {
							let pages = getCurrentPages();
							let prevPage = pages[pages.length - 2];
							if (res.confirm) {
								console.log(prevPage);
								prevPage.$vm.native_order_id=id;
								prevPage.$vm.orderPlaceName=name;
								prevPage.$vm.workerFilter();
								if (!uni.getStorageSync('index-city-filter')) {
									// event.emit('afterFilter');
									uni.setStorageSync('index-city-filter', true);
								}
								uni.navigateBack({});
							}
						}
					})
				}else if(pageType === 'jobWant') {
					console.log('jobWant的执行');
				//这里主要改文字
				  uni.showModal({
					title: '确认选择',
					content: '您当前选择的籍贯为 '+name+' 确认选择吗？',
					content: '您当前选择的地区为'+provinceName+''+cityName+''+name+'，确认选择吗？',
					confirmColor: '#f94c48',
					success: (res) => {
					  if (res.confirm) {
						  prevPage.$vm.province_id=provinceActive;
						  prevPage.$vm.city_id=cityActive;
						  prevPage.$vm.district_id=id;
						  prevPage.$vm.consPlace=provinceName + cityName + name;
						  uni.navigateBack({});
					  }
					}
				  })
				}
			},
		},
		data() {
			return {
				pageType: "", // 判断进入页面的类型
				/*所有省数据*/
				provinceData: [],
				/*所有市数据*/
				cityData: [],  
				/*所有区域数据*/
				districtData: [],
				/*省id*/
				provinceActive: "",
				/*省名字*/
				provinceName: "",
				/*市id*/
				cityActive: "",
				/*市名字*/
				cityName: "",
				system_height:'10vh',
			}
		}
	}
</script>

<style>
	@import url("../../static/style/app.css");

	.top-container {
		position: fixed;
		top: 0;
		width: 100%;
		display: flex;
		background-color: #fff;
		border-bottom: 1px solid #e5e5e5;
		z-index: 5;
	}

	.top-item {
		margin: 15upx 0;
		border-right: 1px solid #ccc;
		flex: 1;
		text-align: center;
	}

	.top-item:last-of-type {
		border-right: 0;
	}

	.container {
		display: flex;
		margin-top: 90upx;
		height: 11150upx;
		overflow:hidden;
	}

	.left,
	.mid,
	.right {
		display: flex;
		flex-direction: column;
		align-items: center;
		flex: 1;
		background-color: #fff;
		height: 100%;
	}

	.mid,
	.right {
		background-color: #f8f8f8;
	}

	.item {
		width: 100%;
		padding: 15upx 0;
		text-align: center;
		box-sizing: border-box;
	}

	.mid-item {
		border-right: 1px solid #ccc;
	}

	.active {
		background-color: #f8f8f8;
		color: #f94c48;
		border-right: 0px;
	}
</style>
